<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=0.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0"/>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<meta name="author" content=""/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="format-detection" content="telephone=no"/>
<link href="../src/css/public.css" type="text/css" rel="stylesheet"/>
<link href="../src/css/bluecolor.css" type="text/css" rel="stylesheet"/>
<!-- Link Swiper's CSS -->
<link rel="stylesheet" href="../src/css/swiper.min.css"/>
<title>CIT首页</title>
</head>
<body>
<!--头部-->
<header class="product-hd hd-color"> <a href="#" class="pre index-pre"></a>CIT </header>
<!--头部滑块部分-->
<div class="banner">
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide"><a href="#"><img src="../src/images/swiper_obj1.png"/></a></div>
      <div class="swiper-slide"><a href="#"><img src="../src/images/swiper_obj2.png"/></a></div>
      <div class="swiper-slide"><a href="#"><img src="../src/images/swiper_obj3.png"/></a></div>
    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination"></div>
  </div>
</div>
</div>
<!--导航条-->
<nav class="index-nav clearfix"> <a href="#" class="index-nav-border">
  <p><img src="../src/images/nav_link_11.png"/></p>
  <p>前往购物</p>
  </a> <a href="#" class="index-nav-border">
  <p><img src="../src/images/nav_link_13.png"/></p>
  <p>商家入驻</p>
  </a> <a href="#" class="index-nav-border">
  <p><img src="../src/images/nav_link_15.png"/></p>
  <p>探索周边</p>
  </a> <a href="#">
  <p><img src="../src/images/nav_link_17.png"/></p>
  <p>个人中心</p>
  </a> </nav>
<!--热门课程模块-->
<article class="hot-course">
  <p class="hot-course-txt">热门课程</p>
  <div class="hot-course-img-con clearfix">
    <div class="hot-course-img-one">
      <div class="lk"><span class="hot-img-txt-one">产品经理</span><img src="../src/images/hot_07.png"/>
        <p class="hot-black-txt">产品经理</p>
        <p class="hot-txt">309课时&nbsp;&nbsp;|&nbsp;&nbsp;2678分钟</p>
      </div>
    </div>
    <div class="hot-course-img-two">
      <div class="lp"><span class="hot-img-txt-one">产品运营</span><img src="../src/images/hot_09.png"/>
        <p class="hot-black-txt">产品经理</p>
        <p class="hot-txt">309课时&nbsp;|&nbsp;2678分钟</p>
      </div>
    </div>
  </div>
</article>
<!--推荐课程模块-->
<article class="hot-course">
  <p class="hot-course-txt">推荐课程</p>
  <!--推荐课程实例1-->
  <div class="hot-course-img-con">
    <div class="tuijian-img"><span class="tuijian-img-txt-one">Web前端开发</span><img src="../src/images/ad_link_05.png"/>
      <p class="hot-black-txt clearfix"><span class="fl">前端设计师</span><span class="fr txt-blue-style">月薪5-40k</span></p>
      <p class="hot-txt">通关时间：10天&nbsp;&nbsp;|&nbsp;&nbsp;在学人数：234</p>
    </div>
  </div>
</article>
<!--推荐课程实例2-->
<article class="hot-course hot-no-margin">
  <div class="hot-course-img-con">
    <div class="tuijian-img"><span class="tuijian-img-txt-one">Web前端开发</span><img src="../src/images/ad_link_05.png"/>
      <p class="hot-black-txt clearfix"><span class="fl">前端设计师</span><span class="fr txt-blue-style">月薪5-40k</span></p>
      <p class="hot-txt">通关时间：10天&nbsp;&nbsp;|&nbsp;&nbsp;在学人数：234</p>
    </div>
  </div>
</article>
<!--推荐课程实例3-->
<article class="hot-course hot-no-margin">
  <div class="hot-course-img-con">
    <div class="tuijian-img"><span class="tuijian-img-txt-one">Web前端开发</span><img src="../src/images/ad_link_05.png"/>
      <p class="hot-black-txt clearfix"><span class="fl">前端设计师</span><span class="fr txt-blue-style">月薪5-40k</span></p>
      <p class="hot-txt">通关时间：10天&nbsp;&nbsp;|&nbsp;&nbsp;在学人数：234</p>
    </div>
  </div>
</article>
<!--推荐课程实例4-->
<article class="hot-course hot-no-margin">
  <div class="hot-course-img-con">
    <div class="tuijian-img"><span class="tuijian-img-txt-one">Web前端开发</span><img src="../src/images/ad_link_05.png"/>
      <p class="hot-black-txt clearfix"><span class="fl">前端设计师</span><span class="fr txt-blue-style">月薪5-40k</span></p>
      <p class="hot-txt">通关时间：10天&nbsp;&nbsp;|&nbsp;&nbsp;在学人数：234</p>
    </div>
  </div>
</article>
<!--底部-->
<footer class="footer">
  <ul>
    <a href="index.html">
    <li><img width="22px" height="22px" src="../src/images/bottom_png_1.png">
      <p class="bottom-blue-txt">学习中心</p>
    </li>
    </a> <a href="mytask.html">
    <li><img width="22px" height="22px" src="../src/images/bottom_png_2.png">
      <p>我的任务</p>
    </li>
    </a> <a href="zone.html">
    <li><img width="22px" height="22px" src="../src/images/bottom_png_3.png">
      <p>个人中心</p>
    </li>
    </a>
  </ul>
</footer>
<!-- Swiper JS --> 
<script src="../src/js/swiper.min.js"></script> 

<!-- Initialize Swiper --> 
<script>
    var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: 2500,
        autoplayDisableOnInteraction: false
    });
    </script>
</body>
</html>